<template>
  <!-- 申报管理 -->
  <div style="padding:20px 20px;">
    <el-card class="xiu_box">
      <div style="width:100%;height:40px;">
        <el-input clearable @keyup.enter.native="page=1;git_act()" style="width:302px;" placeholder="输入物品名称搜索" v-model="recru" class="input-with-select">
          <el-button @click='page=1;git_act()' slot="append" icon="el-icon-search"></el-button>
        </el-input>

        <el-button @click='cgselects(false)' type="warning" style='float:right;margin-right:15px;'>采购</el-button>
        <el-button icon="el-icon-download" type="warning" style='float:right;margin-right:15px;'>请购单</el-button>
      </div>
      <el-table :data="tableData"　v-loading="loading"  style="width:100%;margin-top:20px;">
        <el-table-column header-align='center' align='center' prop="name" label="名称" ></el-table-column>
        <el-table-column header-align='center' align='center' prop="typeId" label="类型" >
          <template slot-scope="scope">{{id_name(scope.row.typeId,$store.state.user.leidata)}}</template>
        </el-table-column>
        <el-table-column header-align='center' align='center' prop="size" label="尺寸" ></el-table-column>
        <el-table-column header-align='center' align='center' prop="model" label="型号" ></el-table-column>
        <el-table-column header-align='center' align='center' prop="provider" label="供应商" ></el-table-column>
        <el-table-column header-align='center' align='center' prop="amount" label="库存数量" ></el-table-column>
        <el-table-column header-align='center' align='center' prop="price" label="单价"></el-table-column>
        <el-table-column header-align='center' align='center' prop="remarks" label="备注" show-overflow-tooltip></el-table-column>
        <el-table-column header-align='center' align='center' width="170" label="操作">
          <template slot-scope="scope">
            <el-button v-if="scope.row.amount!=0" @click="selects(false,scope.row)" class='btn' type="success">申请</el-button>
            <el-button v-else class='btn' @click="cgselects(scope.row)" type="warning">采购</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!-- 分页 -->
      <el-pagination :current-page='page' v-show='totals>15' style='margin-top:35px;width:100%;text-align:center;'
                     background @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="ye_s"
                     :page-size="size" layout="total, sizes, prev, pager, next, jumper" :total="totals">
      </el-pagination>
    </el-card>
    <DeclaShen :edit="edit" ref="DeclaShen"></DeclaShen>
    <CgShen :edit="purchaseedit" ref="CgShen"></CgShen>
  </div>
</template>
<script>
  import { querys } from '@/api_bast/decla_man.js'
  import DeclaShen from '@/components/MES/decla_shen.vue'
  import CgShen from '@/components/MES/cg_shen.vue'
  export default {
    components: {DeclaShen,CgShen},//声明子组件
    computed:{},
    data(){
      return {
        edit:0,//物料申请 0为注册 1为编辑
        purchaseedit:0,//采购申请 0为注册 1为编辑
        loading:false,
        tableData:[],
        page:1,
        size:15,
        totals:0,
        ye_s:[15,20],
        recru:'',//查询条件
      }
    },
    methods:{
      cgselects(num){//打开采购申请表单
        this.edit = 0;
        this.$refs.CgShen.panertfn(num);
      },
      selects(num,numdata){//打开物料申请表单
        this.edit = 0;
        this.$refs.DeclaShen.panertfn(num,numdata);
      },
      git_act(){//获取数据列表
        let dat= {
          pageNo:this.page,
          pageSize:this.size,
          name:this.recru
        };
        this.loading=true;
        querys(dat).then(response => {
          this.loading = false;
          if(!response.resData){return false;}
          this.totals = response.resData.total;
          this.tableData = response.resData.list;
        })
      },
      handleCurrentChange(val) {//点击页数
        this.page = val;
        this.git_act();
      },
      handleSizeChange(val) {//点击条数
        this.size = val;
        this.git_act();
      },
    },
    mounted(){
      this.git_act();//获取数据
    },
  }
</script>

<style scoped="scoped">
  .xiu_box{width: 100%;}
  .btn{padding:10px 5px;}
</style>
